import { toDisplayString as _toDisplayString, createVNode as _createVNode, Fragment as _Fragment, openBlock as _openBlock, createBlock as _createBlock } from "vue"

/** case1 */
/*
<div>{{name}}</div>
<p>
  <span>{{age}}</span>
</p>
*/
export function render(_ctx, _cache, $props, $setup, $data, $options) {
  return (_openBlock(), _createBlock(_Fragment, null, [
    _createVNode("div", null, _toDisplayString(_ctx.name), 1 /* TEXT */),
    _createVNode("p", null, [
      _createVNode("span", null, _toDisplayString(_ctx.age), 1 /* TEXT */)
    ])
  ], 64 /* STABLE_FRAGMENT */))
}

console.log(render({name: 'ahhh', age: 123})); //可以发现多一个 dynamicChildren 的属性, 它就是搜集到的动态节点数组, 这是一个扁平化的, 会将树的递归拍平成一个数组


/** case2 会影响结构的都会被标记成block节点 v-if v-else*/
/*
<div>
  //↓ 这是一个block
  <template v-if="flag">
    <p>hello world</p>
    <div>{{xxx}}</div>
  </template>
  //↓ 这是另外一个block
  <template v-else>
    <div>{{xxx}}</div>
    <p>hello world</p>
  </template>
</div>
*/
/*function render(_ctx, _cache, $props, $setup, $data, $options) {
  return (_openBlock(), _createBlock("div", null, [
    (_ctx.flag)
      ? (_openBlock(), _createBlock(_Fragment, { key: 0 }, [
        _createVNode("p", null, "hello world"),
        _createVNode("div", null, _toDisplayString(_ctx.xxx), 1 /!* TEXT *!/)
      ], 64 /!* STABLE_FRAGMENT *!/))
      : (_openBlock(), _createBlock(_Fragment, { key: 1 }, [
        _createVNode("div", null, _toDisplayString(_ctx.xxx), 1 /!* TEXT *!/),
        _createVNode("p", null, "hello world")
      ], 64 /!* STABLE_FRAGMENT *!/))
  ]))
}

console.log(render({name: 'ahhh', age: 123}));*/
